<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="bootstrap.min.css"/>
		<script src="jquery-3.6.0.min.js"></script>
		<script src="popper.min.js"></script>
		<script src="bootstrap.min.js"></script>
		
		<style type="text/css">
			#submit{
				background-color: dodgerblue;
				color: white;
			}
			
			.bn{
				margin-left: 500px;
				
		}
		#sex{
			width:700px ;
		}
		.k{
			width:700px ;
		}
		
		</style>
	</head>
	<body>
		<form onsubmit="return submitTable()" class="bn">
				<label for="xh"> # </label><br />
			  	<input type="text" id="xh" class="k"><br />
			  	
				<label for="name">姓名：</label><br />
			  	<input type="text" id="name" class="k"><br />
			  	
			  	<label for="sno">学号：</label><br />
				<input type="text" id="sno" class="k"><br />
				
				<label for="classname">班级：</label><br />
				<input type="text" id="classno" class="k"><br />
				
				<label for="classname">性别：</label><br />
				<select id="sex">
					<option>男</option>
					<option>女</option>
				</select><br />
				
			
				<input name="submit" type="button" id="submit" value="新增" onclick="return submitTable()">
				<input name="submit" type="button" id="submit" value="更新" onclick="re">
				
				
		</form>
		
		<hr>
		
		<table border="1" width="100%" align="center" id="table">
		
				<tr>
					<th> # </th>
					<th>姓名</th>
					<th>学号</th>
					<th>班级</th>
					<th>性别</th>
					<th>操作栏<br />
						
					</th>
					
				</tr>
				
		</table>
		
		</body>
		<script type="text/javascript">
			function re(){
				
			}
					
				function submitTable(){
					
						var xh=document.getElementById("xh").value;
						
						var name=document.getElementById("name").value;
					
						var sno = document.getElementById("sno").value;
											
						var classno=document.getElementById("classno").value;
						
						var sex=document.getElementById("sex").value;
						
						row = document.getElementById("table").insertRow();
						
					if(row!=null){
						
						cell = row.insertCell();
						
						cell.innerHTML=xh;
						
						cell = row.insertCell();
						
						cell.innerHTML=name;
						
						cell=row.insertCell();
						
						cell.innerHTML=sno;
						
						cell = row.insertCell();
						
						cell.innerHTML=classno;
						
						cell = row.insertCell();
						
						cell.innerHTML=sex;
						
					
					}
					
					return false;
					
					}
			
		</script>
</html>
